import React from 'react';
import {Form, Row, Col, Button, Dropdown, Menu, Icon, message ,Divider,Input,Cascader,Select } from 'antd';
import Grid from '../../components/table/grid';
import SettleAccounts from './settleAccounts';
import {sessionManager} from '../../utils/sessionStorage';
import AuthButton from '../../components/auth/authButton'
import {withRouter} from 'react-router-dom';
import {injectIntl} from 'react-intl';
import PickCity from '../../components/pickCity/pickCity';
import BindVIN from './bindVIN';
import RemoveVIN from './removeVIN';
import axios from 'axios';
const Option = Select.Option;
const FormItem = Form.Item;
const createForm = Form.create;

class powerStubManage extends React.Component {
	constructor(props) {
		super(props);
		this.state = {
			expand: false,
			currentRowInfo: {},
			visible: false,
			visible4VIN: false,
			visible4removeVIN: false,
			visible4Modify: false,
			options: [],
			params: {},
			refresh: 0,
			accountIds: [],
			accountId: null,
			stationtype:[],
			local: [],
		};
		const common = this.props.intl.messages.common;
		this.columns = [
			{
			title: '桩群名称',
			dataIndex: 'name',
			key: 'name',
			width:200,
		}, {
			title: '电桩总数',
			dataIndex: 'stubCnt',
			key: 'stubCnt',
			width:100,
		},
			{
				title: '电桩故障数',
				dataIndex: 'stubErrorCnt',
				key: 'stubErrorCnt',
				width:100,
			},
			{
				title: '充电中电桩数',
				dataIndex: 'stubChargingCnt',
				key: 'stubChargingCnt',
				width:100,
			},
			{
				title: '最大功率',
				dataIndex: 'kwLimit',
				key: 'kwLimit',
				width:100,
			},
			{
				title: '计费标准',
				key: 'totalFeeInfo',
				width:300,
				render: (text) => {
					return (<span dangerouslySetInnerHTML={{__html:text.totalFeeInfo}}></span>)
				}
			},
			{
				title: '建设状态',
				key: 'isBuilded',
				width:120,
				render: (text) => {
					switch (text.isBuilded) {
						case 0:
							return '建设中';
						case 1:
							return '已完成';
						default:
							break
					}
				}
			},
			{
				title: '启用状态',
				key: 'isEnable',
				render: (text) => {
					switch (text.isEnable) {
						case 0:
							return '停用';
						case 1:
							return '启用';
						default:
							break
					}
				}
			},
			{
				title: common.operation,
				key: 'operation',
				fixed:'right',
				width:300,
				render: (text, record) => {
					return (
						<span>
                            <span data-auth="003001003">
                                <a onClick={() => this.showDiffMoudle(text, record, 'order')}>{common.chargeOrder}</a>
                                <Divider type="vertical"/>
                            </span>
                            <span>
                                <a onClick={() => this.showDiffMoudle(text, record, 'equipmentList')}>{common.equipmentList}</a>
                                <Divider type="vertical"/>
                            </span>
                            <span>
                                <a onClick={() => this.showDiffMoudle(text, record, 'baseInfo')}>{common.baseInfo}</a>
                                <Divider type="vertical"/>
                            </span>
                            <span>
                                <a onClick={() => this.showDiffMoudle(text, record, 'ledgerRules')}>{common.ledgerRules}</a>
                            </span>
                </span>
					)
				},
			}];
	}

	//清空
	handleReset = () => {
		this.props.form.resetFields();
	}

	toggle = () => {
		const { expand } = this.state;
		this.setState({ expand: !expand });
	}
	//表单验证
	handleSubmit = (e) => {
		e.preventDefault();
		this.props.form.validateFieldsAndScroll((errors, values) => {
			if (!!errors) {
				console.log('Errors in form!!!');
				return;
			}
			console.log('form--VALUES---',values);
			switch (values.city&&values.city.length) {
				case 1:
					values.city=this.formatCityId(values.city[0],4);
					break;
				case 2:
					values.city=this.formatCityId(values.city[1],2);
					break;
				case 3:
					values.city=values.city[2]
					break;
				default:
					break
			}
			// values.stubGroupId = values.stubGroupId.currency;
			this.setState({
				params: {...values},
				refresh: this.state.refresh + 1
			});
		});
	};

	formatCityId(id,num){
		if(num==2){//市
			return id.replace(/\d{2}$/,'__')
		}
		if(num==4){//省
			return id.replace(/\d{4}$/,'____')
		}
	}
	freshGrid = () => {
		this.setState({
			refresh: this.state.refresh + 1
		});
	};

	showDiffMoudle(text, record, moudle) {
		sessionManager.set('selectStuGroup', text);
		switch (moudle) {
			case 'equipmentList':
				sessionManager.set('equipIDNAMEinfo',text);
				this.props.history.push({pathname: '/powerStation/equipmentList', state: {flag: true}});
				break;
			case 'baseInfo':
				this.props.history.push({pathname: '/powerStation/baseInfo'});
				break;
			case 'order':
				this.props.history.push({pathname: '/powerStation/chargeOrder'});
				break;
			case 'ledgerRules':
				sessionManager.set('stubGroupId',text.id);
				this.props.history.push({pathname: '/powerStation/ledgerRules',state:{stubGroupId:text.id}});
				break;
			default:
				break
		}
	}

	handleCancel = () => {
		this.setState({
			visible: false,
			visible4VIN: false,
			visible4removeVIN: false,
			visible4Modify: false,
		});
	}
	changeAddress(val){
		console.log('changeaddress',val)
	}

	render() {

		const {getFieldDecorator} = this.props.form;
		const common = this.props.intl.messages.common;

		return (
				<div>
					<Form className="ant-advanced-search-form"
						onSubmit={this.handleSubmit}>
						<Row gutter={24}>
							<Col xl={6} xxl={4} >
								<FormItem label="">
									{getFieldDecorator('name', {
									})(
										<Input placeholder="桩群名称" />
									)}
								</FormItem>
							</Col>
							<Col xl={6} xxl={4}>
								<FormItem label="">
									{getFieldDecorator('stubId', {
									})(
										<Input placeholder="桩编号" />
									)}
								</FormItem>
							</Col>
							<Col xl={6} xxl={4}  >
								<FormItem
									label="">
									{getFieldDecorator(`city`,)(
										<PickCity placeholder="请选择城市" level1={{url:'/api/province/option',params:{type:1}}} level2={{url:'/api/city/option'}} level2Params={{params:{type:1}}} level3={{url:'/api/region/option',params:{type:1}}} />
									)}
								</FormItem>
							</Col>
							<Col xl={6} xxl={4} >
								<FormItem label="">
									{getFieldDecorator('placeType', {
									})(
										<Select placeholder="场地类型"
											allowClear={true}>
											<Option value="1222">居住地</Option>
											<Option value="1223">目的地</Option>
											<Option value="1224">工作地</Option>
										</Select>
									)}
								</FormItem>
							</Col>
							<Col xl={6} xxl={4}  style={{ display: this.state.expand? 'block':'none' }}>
								<FormItem label="">
									{getFieldDecorator('stubGroupType', {
									})(
										<Select placeholder="桩群类型"
											allowClear={true}>
											<Option value="0">公共</Option>
											<Option value="1">个人</Option>
											<Option value="2">专用</Option>
										</Select>
									)}
								</FormItem>
							</Col>
							<Col xl={6} xxl={4}  style={{ display: this.state.expand? 'block':'none'}}>
								<FormItem label="">
									{getFieldDecorator('type', {
									})(
										<Select placeholder="自营"
											allowClear={true}>
											<Option value="0">非自营桩群</Option>
											<Option value="1">自营桩群</Option>
										</Select>
									)}
								</FormItem>
							</Col>
							<Col xl={6} xxl={4}  style={{display: this.state.expand? 'block':'none' }}>
								<FormItem label="">
									{getFieldDecorator('selIsAccount', {
									})(
										<Select placeholder="分账"
											allowClear={true}>
											{/*否则不传*/}
											<Option value="0">不分账</Option>
											<Option value="1">分账</Option>
										</Select>
									)}
								</FormItem>
							</Col>
							<Col xl={6} xxl={4}  style={{ display: this.state.expand? 'block':'none' }}>
								<FormItem label="">
									{getFieldDecorator('hasTotalFeeInfo', {
									})(
										<Select placeholder="是否有计费"
											allowClear={true}>
											<Option value="0">无</Option>
											<Option value="1">有</Option>
										</Select>
									)}
								</FormItem>
							</Col>

							<Col xl={6} xxl={4}  style={{ display: this.state.expand? 'block':'none' }}>
								<FormItem label="">
									{getFieldDecorator('billUserAccount', {
									})(
										<Input placeholder="分账人账号" />
									)}
								</FormItem>
							</Col>
							<Col xl={6} xxl={4}  style={{ display: this.state.expand? 'block':'none' }}>
								<FormItem label="">
									{getFieldDecorator('isBuilded', {
									})(
										<Select placeholder="建设状态"
											allowClear={true}>
											<Option value="0">否</Option>
											<Option value="1">是</Option>
										</Select>
									)}
								</FormItem>
							</Col>
							<Col xl={6} xxl={4}  style={{display: this.state.expand? 'block':'none' }}>
								<FormItem label="">
									{getFieldDecorator('isEnable', {
									})(
										<Select placeholder="启用状态"
											allowClear={true}>
											<Option value="1">启用</Option>
											<Option value="0">未启用</Option>
										</Select>
									)}
								</FormItem>
							</Col>
						</Row>
						<Row className="padB-10">
							<Col span={24} style={{ textAlign: 'right' }}>
								<Button type="primary" htmlType="submit">{common.search}</Button>
								{/*<Button style={{ marginLeft: 8 }} onClick={this.handleReset}>
									Clear
								</Button>*/}
								<Button  type="primary"  span={24}  style={{ textAlign: 'right',marginLeft: 8 }} onClick={this.toggle}>
									{common.more} <Icon type={this.state.expand ? 'up' : 'down'} />
								</Button>
							</Col>
						</Row>
					</Form>
					<Grid refresh={this.state.refresh}
						  params={this.state.params}
						  columns={this.columns} url="api/stubGroup/listForInvestor/qry" scroll={{x:1500}} />
					{/*<ModifyStub visible={this.state.visible4Modify} handleCancel={this.handleCancel}*/}
					{/*freshGrid={this.freshGrid}/>*/}

				</div>

		)
	}
}

//ant 表格验证需要创建表格-createForm
powerStubManage = createForm()(powerStubManage);
export default injectIntl(powerStubManage)

